<header class="page-header clearfix">
    <h4><i class="fa fa-cubes"></i>容器集群</h4>
    <div class="toolbox">
        <button type="button" ng-click="list.getList()" ng-disabled="list.tleLoading">
            <i ng-class="{'fa-spin': list.tleLoading}" class="fa fa-refresh"></i>刷新
        </button>
        <button type="button" ng-click="list.addCluster()">
            <i class="fa fa-plus"></i>配置新集群
        </button>
    </div>
</header>
<section>
    <div class="cluster-container clearfix">
        <a ng-href="#/k8s/overview?kDbCode={{::elem.clusterCode}}"
           class="panel" ng-repeat="elem in list.table">
            <div class="cluster-delete">
                <button type="button" class="animate" ng-click="list.addCluster(elem);$event.preventDefault();">
                    <i class="fa fa-edit margin-right-5"/>编辑
                </button>
                <button type="button" class="animate" ng-click="list.deleteCluster(elem);$event.preventDefault();">
                    <i class="fa fa-times margin-right-5"/>删除
                </button>
                <button ng-show="elem.oprLoading" class="oprLoading" type="button">
                    <i class="fa fa-refresh fa-spin fa-fw"></i></button>
            </div>
            <div class="panel-body">
                <dl>
                    <dd class="resource-grid clearfix">
                        <div>
                            <div><i class="fa fa-database margin-right-5"/>宿主机</div>
                            <div>{{elem.resData.nodeNum}}</div>
                        </div>
                        <div>
                            <div><i class="fa fa-cube margin-right-5"/>容器</div>
                            <div>{{elem.resData.podsNum}}</div>
                        </div>
                        <div>
                            <div><i class="fa fa-gears margin-right-5"/>服务</div>
                            <div>{{elem.resData.rcNum}}</div>
                        </div>
                    </dd>
                    <dt>DashBoard 地址</dt>
                    <dd>{{::elem.monitorUrl}}</dd>
                    <dt>负载均衡地址</dt>
                    <dd>{{::elem.lvsUrl}}</dd>
                </dl>
            </div>
            <div class="panel-footer">
                <div>{{::elem.clusterCode}}</div>
                <div class="footer-info" title="{{::elem.clusterName}}">{{::elem.clusterName}}</div>
            </div>
        </a>
    </div>
</section>